import QtQuick 2.0

// 孔位筛选单独拆出来吧……
Rectangle {

    id: root

    // public =============================================================================

    function setList(list, filter){        // 设置当前状态
        posiList = list
        posiList_filter = filter
        selectMatrix = []
        for(let r = 0; r < row; r ++){
            selectMatrix.push([])
            for(let c = 0; c < col; c ++){
                var posiname = letters[r] + (c+1)
                if(posiList_filter.indexOf(posiname) !== -1){
                    selectMatrix[r].push(1)
                }else if(posiList.indexOf(posiname) !== -1){
                    selectMatrix[r].push(2)
                }else{
                    selectMatrix[r].push(0)
                }

            }
        }
        refreshPannel()
    }

    signal selectedChanged()

    function getList(){                             // 获取当前选中的孔位
        var selectList = []
        for(let c = 0; c < col; c ++){
            for(let r = 0; r < row; r ++){
                if(selectMatrix[r][c] === 1){
                    selectList.push(letters[r] + (c+1))
                }
            }
        }
        return selectList
    }

    // private ============================================================================
    property int row: 8
    property int col: 12
    property int gridSize: 45*dp
    property var letters: ["A","B","C","D","E","F","G","H","I","J","K"]

    property var posiList: []
    property var posiList_filter: []
    property var selectMatrix: []       // 0: 未设置 1: 选择 2: 未选择


    function refreshPannel(){
        for(let i = 0; i < col*row; i ++){
            var item = repeater.itemAt(i)
            let r = Math.floor(i / col)
            let c = i % col
            item.color = selectMatrix[r][c]===0 ? "#F6F6F6" : (selectMatrix[r][c]===1 ? "#A3AEFF" : "white")
            // 灰色蒙版覆盖
            if(selectMatrix[r][c]===0){
                var mk = item.children[1]
                mk.visible = true
            }else{
                var mk = item.children[1]
                mk.visible = false
            }
        }
    }


    // 样式 ========================================================================


    height: row*gridSize + 30*dp
    width: col*gridSize + 30*dp

    Rectangle{          // 上面的表头
        x: 30*dp
        height: 30*dp
        width: gridSize * col
        color: "#EBF3FF"
        Row{
            Repeater{
                model: col
                Item{
                    height: 30*dp
                    width: gridSize
                    Text {
                        text: index+1
                        anchors.centerIn: parent
                        font.pixelSize: config.fontsize
                    }
                }
            }
        }
    }
    Rectangle{          // 左侧的表头
        height: gridSize * row
        width: 30*dp
        y: 30*dp
        color: "#EBF3FF"
        Column{
            Repeater{
                model: row
                Item{
                    height: gridSize
                    width: 30*dp
                    Text{
                        text: letters[index]
                        anchors.centerIn: parent
                        font.pixelSize: config.fontsize
                    }
                }
            }
        }
    }

    Rectangle{
        id: pannel
        property int maskX1: 0
        property int maskY1: 0
        property int maskX2: 0
        property int maskY2: 0
        border.color: "#CCCCCC"
        color: "#CCCCCC"
        y: 30*dp
        x: 30*dp
        height: row*gridSize
        width: col*gridSize
        Grid{
            columns: col
            rows: row
            columnSpacing: 1*dp
            rowSpacing: 1*dp
            Repeater{
                id: repeater
                model: row*col
                Rectangle{
                    color: "white"
                    width: gridSize-1*dp
                    height: gridSize-1*dp
                    Text{       // 有childAt(0)调用，不要改位置
                        text: letters[Math.floor(index/col)] + (index%col + 1)
                        anchors.centerIn: parent
                        font.pixelSize: config.fontsize
                    }
                    Rectangle{      // 灰色蒙版
                        anchors.fill: parent
                        color: "#F6F6F6"
                        visible: false
                    }
                    Rectangle{      // 选中蒙版
                        anchors.fill: parent
                        color: "#333333"
                        opacity: 0.2
                        visible: false
                    }

                    MouseArea{
                        anchors.fill: parent
                        onPressed:{
                            var mousePos = mapToItem(pannel, mouseX, mouseY)
                            pannel.maskX1 = mousePos.x
                            pannel.maskY1 = mousePos.y
                            mask.height = 0
                            mask.width = 0
                            mask.visible = true
                        }
                        onPositionChanged: {
                            var mousePos = mapToItem(pannel, mouseX, mouseY)
                            pannel.maskX2 = mousePos.x
                            pannel.maskY2 = mousePos.y
                            mask.x = Math.min(pannel.maskX1, pannel.maskX2)
                            mask.y = Math.min(pannel.maskY1, pannel.maskY2)
                            mask.height = Math.abs(pannel.maskY1 - pannel.maskY2)
                            mask.width = Math.abs(pannel.maskX1 - pannel.maskX2)

                        }
                        onReleased: {
                            root.focus = true
                            var mousePos = mapToItem(pannel, mouseX, mouseY)
                            pannel.maskX2 = mousePos.x
                            pannel.maskY2 = mousePos.y
                            mask.visible = false

                            var row1 = Math.min(Math.floor(pannel.maskY1 / gridSize), Math.floor(pannel.maskY2 / gridSize))
                            var row2 = Math.max(Math.floor(pannel.maskY1 / gridSize), Math.floor(pannel.maskY2 / gridSize))
                            var col1 = Math.min(Math.floor(pannel.maskX1 / gridSize), Math.floor(pannel.maskX2 / gridSize))
                            var col2 = Math.max(Math.floor(pannel.maskX1 / gridSize), Math.floor(pannel.maskX2 / gridSize))

                            // 判断全置白还是全置黑
                            var allWhite = true
                            for(let r = row1; r <= row2; r ++){
                                for(let c = col1; c <= col2; c ++){
                                    if(selectMatrix[r][c] === 2){
                                        allWhite = false
                                        break
                                    }
                                }
                            }
                            for(let r = row1; r <= row2; r ++){
                                for(let c = col1; c <= col2; c ++){
                                    if(selectMatrix[r][c] === 0){
                                        continue
                                    }
                                    selectMatrix[r][c] = allWhite ? 2 : 1
                                }
                            }
                            refreshPannel()
                            root.selectedChanged()
                        }
                    }
                }
            }
        }

        Rectangle{
            id: mask
            color: Qt.rgba(0.8,0.8,1,0.1)
            border.color: Qt.rgba(0.8,0.8,1,0.6)
            border.width: 2*dp
        }
    }



}
